<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        body {
            width: 50%;
            height: 100vh;
            margin: 0 auto;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
        }

        .add-condition {
            position: absolute;
            transform: translate(-50%, -30%);
        }

        a[href="#"] {
            text-decoration: none;
        }
    </style>
</head>

<body>
    <div style="width: 100%;">
        <strong>粗体，语义表强调</strong>
        <em>斜体，语义表语气强调</em><br>
        <b>粗体，无语义</b>
        <i>斜体，无语义；常用来设置小图标</i>
        <hr>
        <small>比父元素小一号字体。在h5中用来表示细则一类内容</small>
        <big>比父元素大一号字体，无语义，已淘汰</big>
        <hr>
        <cite>斜体，网页中所有加书名号的内容都可以使用cite标签，表参考的内容</cite>
        <q>加引号，表段引用(行内引用)</q>
        <blockquote>无书名号，块引用</blockquote>
        <hr>
        <p>
            2*2*2*2=2 <sup>4</sup>
        </p>
        <p>
            颠倒的万书山 <a href="#"><sup>[1]</sup></a> ，圣寂池<a href="#"><sup>[2]</sup></a><br>
        </p>
        <p style="position: relative;">
            2Al+2Cu+O<sub>2</sub>=<sup class="add-condition">△</sup>=Cl<sub>2</sub>+2Au+CO<sub>2</sub>↑
        </p>
        <hr>
        <del>原价998</del><strong>现价98</strong><br>
        SSR/SP召唤券<ins>&nbsp;灯鹿&nbsp;</ins>就送
        <hr>
        <pre>
            预格式标签，保留原本格式
            int DFS(value, n)
            {
                if (value > LIMIT_VALUE)
                    return 0;
                if (value == LIMIT_VALUE)
                    return 1;
                if (n == LIMIT_N)
                    return 1;
                return DFS(value + 1, n + 1) + DFS(value, n + 1);
            }
        </pre>
        <code>
            专门用于表示代码的标签,但不保留格式,因此结合pre使用
            <br> 
            int DFS(value, n)
            {
                if (value > LIMIT_VALUE)
                    return 0;
                if (value == LIMIT_VALUE)
                    return 1;
                if (n == LIMIT_N)
                    return 1;
                return DFS(value + 1, n + 1) + DFS(value, n + 1);
            }
        </code>
    </div>
</body>

</html>